<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui">
<ui:composition template="template.xhtml">

	<ui:define name="header">
		<ui:include src="encabezado.xhtml" />
	</ui:define>

	<ui:define name="content">
		<h:form>
			<f:loadBundle basename="mensajes" var="msgs" />
			<h1>
				<h:outputText value="#{msgs['listaPedidos.titulo']}" />
			</h1>
			<h:messages errorStyle="color: red;" />


			<h2>
				<h:outputText value="#{msgs['listaPedidos.enCurso']}" />
			</h2>


			<h:dataTable id="tablaPedidosEnCurso"
				value="#{pedidosClienteBean.listaPedidos}" var="lp"
				styleClass="order-table" headerClass="order-table-header"
				rowClasses="order-table-odd-row,order-table-even-row">
				<h:column>
					<f:facet name="header">Fecha/hora de creación</f:facet>
					<h:outputText value="#{lp.fechaHoraCreacion}">
						<f:convertDateTime pattern="dd/MM/yyyy HH:mm" />
					</h:outputText>

				</h:column>

				<h:column>
					<f:facet name="header">Artículo</f:facet>
	    				#{lp.descripcion}
	    			</h:column>

				<h:column>
					<f:facet name="header">Origen</f:facet>
	    				#{lp.direccionOrigen}
	    			</h:column>

				<h:column>
					<f:facet name="header">Destino</f:facet>
	    				#{lp.direccionDestino}
	    			</h:column>

				<h:column>
					<f:facet name="header">Peso</f:facet>
	    				#{lp.peso}
	    			</h:column>

				<h:column>
					<f:facet name="header">Volumen</f:facet>
	    				#{lp.volumen}
	    			</h:column>

				<h:column>
					<f:facet name="header">Estado</f:facet>
	    				#{lp.estadoActual.estado}
	    			</h:column>

			</h:dataTable>



			<h2>
				<h:outputText value="#{msgs['listaPedidos.completados']}" />
			</h2>

			<h:dataTable id="tablaPedidosCompletados"
				value="#{pedidosClienteBean.listaEntregados}" var="entregados"
				styleClass="order-table" headerClass="order-table-header"
				rowClasses="order-table-odd-row,order-table-even-row">
				<h:column>
					<f:facet name="header">Fecha/hora de creación</f:facet>
	    						#{entregados.fechaHoraCreacion}
	    	
	    			</h:column>
				<h:column>
					<f:facet name="header">Artículo</f:facet>
	    				#{entregados.descripcion}
	    			</h:column>

				<h:column>
					<f:facet name="header">Origen</f:facet>
	    				#{entregados.direccionOrigen}
	    			</h:column>

				<h:column>
					<f:facet name="header">Destino</f:facet>
	    				#{entregados.direccionDestino}
	    			</h:column>

				<h:column>
					<f:facet name="header">Peso</f:facet>
	    				#{entregados.peso}
	    			</h:column>

				<h:column>
					<f:facet name="header">Volumen</f:facet>
	    				#{entregados.volumen}
	    			</h:column>
				<h:column>
					<f:facet name="header">Fecha/hora de entrega</f:facet>
	    				#{entregados.fechaHoraEntrega}
	    			</h:column>
			</h:dataTable>
			<h:panelGroup>
				<p:button id="btnVolver" value="#{msgs['boton.volver']}"
					outcome="menuCliente">
				</p:button>
				<p:button value="Cargar Pedido" outcome="cargarPedidos"></p:button><br />
			</h:panelGroup>
		</h:form>
	</ui:define>
	<ui:define name="footer">
		<ui:include src="pie.xhtml" />
	</ui:define>
</ui:composition>
</html>